<template>
  <div class="app-container" v-loading.fullscreen.lock="loading">
    <div class="filter-container">
      <el-select v-model="reqData.universityId" filterable placeholder="所属大学">
        <el-option v-for="item in universityList" :key="item.universityId" :label="item.universityName" :value="item.universityId" />
      </el-select>
      <el-select v-model="reqData.collegeLevelId" filterable placeholder="分数段位">
        <el-option v-for="item in collegeLevelList" :key="item.collegeLevelId" :label="item.collegeLevelName" :value="item.collegeLevelId" />
      </el-select>
      <el-select style="width: 110px;" v-model="reqData.isMatch" placeholder="是否匹配">
        <el-option v-for="item in isMatchList" :key="item.id" :label="item.name" :value="item.id">
      </el-option>
      </el-select>
      <el-select style="width: 110px;" v-model="reqData.isCooperation" placeholder="是否合作">
        <el-option v-for="item in isCooperationList" :key="item.id" :label="item.name" :value="item.id">
        </el-option>
      </el-select>
      <el-select style="width: 110px;" v-model="reqData.isSingle" placeholder="是否单招">
        <el-option v-for="item in isSingleList" :key="item.id" :label="item.name" :value="item.id">
        </el-option>
      </el-select>
      <el-select style="width: 110px;" v-model="reqData.isArt" placeholder="是否艺考">
        <el-option v-for="item in isArtList" :key="item.id" :label="item.name" :value="item.id">
        </el-option>
      </el-select>
      <el-input placeholder="院校名称" v-model="reqData.name" style="width: 200px;"></el-input>
    </div>
    <div class="filter-container">
      <el-button type="primary" icon="el-icon-search" @click.native.prevent="handleSearch">
        搜索
      </el-button>
      <el-button style="margin-left: 10px;" type="primary" icon="el-icon-edit" @click.native.prevent="handleCreate">
        添加
      </el-button>
    </div>
    <el-table border stripe highlight-current-row style="width: 100%;" :data="listData" :empty-text="emptyText">
      <el-table-column label="ID" width="54px" prop="collegeId"></el-table-column>
      <el-table-column label="招生代码" prop="collegeCode"></el-table-column>
      <el-table-column label="名称" prop="collegeName"></el-table-column>
      <el-table-column label="分数段位" prop="collegeLevelName"></el-table-column>
      <el-table-column label="注册码" prop="collegeRegCode"></el-table-column>
      <el-table-column label="注册码使用次数" prop="collegeRegCodeNum"></el-table-column>
      <el-table-column label="是否匹配" prop="collegeIsMatchShow"></el-table-column>
      <el-table-column label="是否合作" prop="collegeIsCooperationShow"></el-table-column>
      <el-table-column label="是否单招" prop="collegeIsSingleShow"></el-table-column>
      <el-table-column label="是否艺考" prop="collegeIsArtShow"></el-table-column>
      <el-table-column label="操作" align="center" width="80px">
        <template slot-scope="scope">
          <el-button size="mini" @click.native.prevent="handleEdit(scope.row.collegeId)">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div class="pager">
      <el-pagination background :pager-count="pagerCount" :page-size="reqData.perPage" :current-page="reqData.curPage"
        layout="prev, pager, next" @current-change="pageChange" :total="total">
      </el-pagination>
    </div>
  </div>
</template>

<script>
  import {
    importExcel,
    getList,
    del
  } from "@/api/college"
  import {
    getAll
  } from "@/api/university"
  import {
    getAll as getAllCollegeLevel
  } from "@/api/college_level"
  import {
    errorMsg,
    successMsg
  } from "@/utils/my"

  export default {
    inject: ["reload"],
    data() {
      return {
        reqData: {
          name: '',
          universityId: '',
          collegeLevelId: '',
          isMatch: '',
          isCooperation: '',
          isSingle: '',
          isArt: '',
          curPage: 1,
          perPage: 10
        },
        pagerCount: 13,
        total: 0,
        listData: [],
        loading: true,
        delRows: [],
        delIds: "",
        emptyText: "暂无任何数据",
        dialogFormVisible: false,
        importFormData: {
          excelUrl: ''
        },
        uploadData: {
          fileType: 'excel'
        },
        uploadUrl: process.env.VUE_APP_BASE_API + '/upload/backend',
        isMatchList: [
          {id: -1, name: '全部'},
          {id: 0, name: '不匹配'},
          {id: 1, name: '匹配'}
        ],
        isCooperationList: [
          {id: -1, name: '全部'},
          {id: 0, name: '未合作'},
          {id: 1, name: '已合作'}
        ],
        isSingleList: [
          {id: -1, name: '全部'},
          {id: 0, name: '不单招'},
          {id: 1, name: '单招'}
        ],
        isArtList: [
          {id: -1, name: '全部'},
          {id: 0, name: '不艺考'},
          {id: 1, name: '艺考'}
        ],
        universityList: [],
        collegeLevelList: []
      }
    },

    created() {
      this.fetchData()
      this.fetchUniversityData()
      this.fetchCollegeLevelData()
    },

    methods: {

      handleCreate() {
        this.$router.push({
          path: "/admin/college/create"
        })
      },

      handleSearch() {
        this.reqData.curPage = 1
        this.fetchData()
      },

      handleEdit(id) {
        this.$router.push({
          path: "/admin/college/edit/" + id
        })
      },

      handleImport() {
        this.dialogFormVisible = true
      },

      pageChange(p) {
        this.reqData.curPage = p
        this.fetchData()
      },

      fetchData() {
        const that = this
        that.loading = true
        let tmpData = JSON.parse(JSON.stringify(that.reqData))
        tmpData.universityId = tmpData.universityId.length <= 0 ? 0 : parseInt(tmpData.universityId)
        tmpData.collegeLevelId = tmpData.collegeLevelId.length <= 0 ? 0 : parseInt(tmpData.collegeLevelId)
        tmpData.isMatch = tmpData.isMatch.length <= 0 ? -1 : parseInt(tmpData.isMatch)
        tmpData.isCooperation = tmpData.isCooperation.length <= 0 ? -1 : parseInt(tmpData.isCooperation)
        tmpData.isSingle = tmpData.isSingle.length <= 0 ? -1 : parseInt(tmpData.isSingle)
        tmpData.isArt = tmpData.isArt.length <= 0 ? -1 : parseInt(tmpData.isArt)
        getList(tmpData).then(res => {
          that.loading = false
          that.total = res.data.total
          that.listData = res.data.list
        })
      },

      handleSelectionChange(rows) {
        this.delRows = rows
        let idArr = []
        for (let i = 0; i < rows.length; i++) {
          idArr.push(rows[i].collegeId)
        }
        this.delIds = idArr.join(",")
      },

      handleDelete() {
        let that = this
        if (that.delIds.length <= 0) {
          return errorMsg("请至少选择一项")
        }
        that.loading = true
        del({
          ids: that.delIds
        }).then(res => {
          that.loading = false;
          if (res.code != 20000) {
            return errorMsg(res.message)
          }
          successMsg(res.message)
          that.reload()
        })
      },

      fetchUniversityData() {
        const that = this
        getAll().then(res => {
          let data = res.data
          that.universityList = []
          that.reqData.universityId = ''
          that.universityList.push({universityId: 0, universityName: '全部'})
          for (let i = 0; i < data.length; i++) {
            that.universityList.push(data[i])
          }
        })
      },

      fetchCollegeLevelData() {
        const that = this
        getAllCollegeLevel().then(res => {
          let data = res.data
          that.collegeLevelList = []
          that.reqData.collegeLevelId = ''
          that.collegeLevelList.push({collegeLevelId: 0, collegeLevelName: '全部'})
          for (let i = 0; i < data.length; i++) {
            that.collegeLevelList.push(data[i])
          }
        })
      },

      uploadSuccess(res) {
        if (res.code != 20000) {
          return errorMsg(res.message)
        }
        this.importFormData.excelUrl = res.data.url
        successMsg(res.message)
      },

      doImport() {
        const that = this
        let d = that.importFormData
        if (d.excelUrl.length <= 0) {
          return errorMsg('请上传excel文件')
        }
        that.dialogFormVisible = false
        that.loading = true
        importExcel(d).then(res => {
          that.loading = false
          if (res.code != 20000) {
            return errorMsg(res.message)
          }
          successMsg(res.message)
          that.reload()
        })
      }

    }
  }
</script>

<style>
  .filter-container {
    margin-bottom: 10px;
  }

  .pager {
    width: 100%;
    text-align: center;
    margin-top: 20px;
  }
</style>
